import 'package:fdropdown/fdropdown.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  //目标组件key，必须用到
  final GlobalKey selectAreaKey = GlobalKey();
  //数据列表
  List<String> items = ['A','B','C','D','E','F','G','H','I','J','K','L',
    // 'M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'
  ];

  @override
  void dispose() {
    FDropdown.instance.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        useMaterial3: false
      ),
      home: Scaffold(
        appBar: AppBar(
          key: selectAreaKey,
          backgroundColor: Colors.blue,
          title: const Text('自定义下拉菜单'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              MaterialButton(
                onPressed: ()=>
                 FDropdown.instance.show(
                    distWidgetKey: selectAreaKey,
                    allMarginTop: 2,
                    allMarginRight: 2,
                    child: ListView(
                      padding: EdgeInsets.only(),
                      shrinkWrap: true,
                      children: items.map((e) => Container(
                        height: 30,
                        alignment: Alignment.center,
                        color: Colors.amber,
                        margin: EdgeInsets.only(
                          bottom: 1
                        ),
                        child: Text(e),
                      )).toList(),
                    )
                 ),
                color: Colors.blue,
                textColor: Colors.white,
                child: Text(
                  '展示常用菜单'
                ),
              ),
              SizedBox(height: 20,),
              MaterialButton(
                onPressed: ()=>
                FDropdown.instance.show(
                    distWidgetKey: selectAreaKey,
                    allMarginTop: 0,
                    isSelfExpand: true,
                    align: OverlayAlign.CENTER,
                    // contMarginLeft: 15,
                    // contMarginRight: 15,
                    allBgColor: Color(0x3f000000),
                    child: ListView(
                      padding: EdgeInsets.only(),
                      shrinkWrap: true,
                      children: items.map((e) => Container(
                        height: 30,
                        alignment: Alignment.centerLeft,
                        color: Colors.amber,
                        margin: EdgeInsets.only(
                            bottom: 1
                        ),
                        child: Text(e),
                      )).toList(),
                    )
                ),
                color: Colors.blue,
                textColor: Colors.white,
                child: Text(
                  '展示自适应菜单'
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
}
